<template>
  <view class="cs-action-sheet">
    <wd-popup
      v-model="show"
      @close="emit('close')"
      @click-modal="emit('close')"
      position="bottom"
      closable
      safe-area-inset-bottom
      lockScroll
    >
      <view class="cs-action-sheet_body">
        <slot></slot>
      </view>
    </wd-popup>
  </view>
</template>

<script lang="ts" setup>
import type { PopupType } from 'wot-design-uni/components/wd-popup/types'

defineOptions({
  name: 'cs-action-sheet',
})

const props = withDefaults(defineProps<{ show: boolean; position?: PopupType }>(), {
  position: 'bottom',
})

const emit = defineEmits<{ close: [] }>()

const show = toRef(props, 'show')
</script>

<style lang="scss" scoped>
.cs-action-sheet_body {
  margin-top: 70rpx;
}
</style>
